﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" Async="true" AsyncTimeout="300" CodeFile="Upload.aspx.cs" Inherits="Upload" MaintainScrollPositionOnPostback="true"%>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
    <title>Upload</title>
    <style type="text/css">
        .form-row{margin-top:10px;}
        .uploadStatus-div{margin-top:10px}
        .uploadReviewHeader-div{margin-top:20px}   
        .uploadReview-div{margin-top:10px}
        .errorReportGridPagerTable td{text-align:inherit} 
        #uploadingLabel{font-size:18px;color:black;}
        .uploadingImageDiv{text-align:center}
        .uploadingLabelDiv{text-align:center}
        #uploadReviewHeaderContainer{margin-right:50px;}
        #toggleViewErrorImage{}
    </style>
    <link rel="Stylesheet" href="Styles/MessageBoxes.css" type="text/css" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
    <div>
        <ul class="nav nav-pills">
			<li class="<%= isAddonLoansUpload()?"active":""%>"><a href="<%=ResolveClientUrl("~/Upload.aspx?mode=addon")%>" data-toggle="#">Addon Loans</a></li>
		    <li class="<%= isReducingBalanceUpload()?"active":""%>"><a href="<%=ResolveClientUrl("~/Upload.aspx?mode=reducingbalance")%>" data-toggle="#">Reducing Balance Loans</a></li>
        </ul>
    </div>
    <div id="mainContentContainer" class="container">
        
        <div runat="server" id="uploadFormContainer" class="container span10">
            
            <div class="well">
                <fieldset>
                    
                    <legend><%= isAddonLoansUpload() ? "Addon Loans Excel File Upload" : isReducingBalanceUpload() ? "ReducingBalance Loans Excel File Upload" : "Loan Excel File Upload"%></legend>
                    <div class="control-group">
                        <asp:Label CssClass="control-label" ID="lblUpload" AssociatedControlID="loanFileUploader" runat="server" Text="File"></asp:Label>
            
                        <div class="controls">
                            <div class="fileupload fileupload-new" data-provides="fileupload">
                              <div class="input-append">
                                <div class="uneditable-input span3"><i class="icon-file fileupload-exists"></i> <span class="fileupload-preview"></span></div><span class="btn btn-file"><span class="fileupload-new">Select file</span><span class="fileupload-exists">Change</span><asp:FileUpload  ID="loanFileUploader" runat="server"/></span><a href="#" class="btn fileupload-exists" data-dismiss="fileupload">Remove</a>
                              </div>
                            </div>
                        </div>
                    </div>
                    <div  id="sheetNameControlGroup" runat="server" class="control-group">
                        <asp:Label ID="lblSheetname" CssClass="control-label"  AssociatedControlID="txtSheetName" runat="server" Text="Sheet Name:"></asp:Label>        
                        <div class="controls">
                            <asp:TextBox ID="txtSheetName" runat="server" Width="250px">Sheet1</asp:TextBox>
                            <%--<asp:RequiredFieldValidator ID="sheetNameRequiredFieldValidator" ControlToValidate="txtSheetName" runat="server" ErrorMessage="Sheet Name is required!"></asp:RequiredFieldValidator>--%>            
                            <a class="help-block">Please ensure that your intended upload sheet name is correct.</a>
                        </div>   
                    </div>
                    <div class="form-actions">
                        <asp:Button ID="btnUpload" CssClass="btn btn-primary" runat="server" OnClientClick="btnUploadClicked()" onclick="btnUpload_Click" 
                            Text="Upload" />

                        <asp:Button ID="btmCancel" CssClass="btn" runat="server" onclick="btnCancel_Click" 
                            Text="Cancel" />
                    </div>
                    <div class="control-group">
                       
                        <div ID="lblUploadStatus" runat="server">
                        </div>

                        <div class="info" ID="infoMessage" runat="server" visible="false"></div>
                        <div class="success" ID="successMessage" runat="server" visible="false"></div>
                        <div class="warning" ID="warningMessage" runat="server" visible="false"></div>
                        <div class="error" ID="errorMessage" runat="server" visible="false"></div>

                        <div id="uploadResultSummary" runat="server" class="span4 well" visible="false">
                            <h4 runat="server" id="H1">Upload Summary</h4>
                            <table class="table table-striped">
                                <tbody>
                                    <tr>
                                        <td>Total Records in file</td>
                                        <td id="totalRecords" runat="server"></td>
                                    </tr>
                                    <tr>
                                        <td>Imported Records</td>
                                        <td id="insertedRecords" runat="server"></td>
                                    </tr>                                    
                                    <tr>
                                        <td>Duplicate Records</td>
                                        <td id="duplicateRecords" runat="server"></td>
                                    </tr>
                                    <tr>
                                        <td>Invalid Records</td>
                                        <td id="invalidRecords" runat="server"></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>                         
                        <asp:Image ID="imgFileStructure" runat="server" />
                    </div>
                </fieldset>
            </div>
            <div id="uploadLoadingModal" class="modal hide fade">
                <div class="modal-body">
                    <div class="uploadingImageDiv">
                        <img src="<%=ResolveClientUrl("~/img/progressbar.gif")%>" alt=""/>
                        <asp:HiddenField runat="server" ID="uploadStateField"/>
                    </div>
                    <div class="uploadingLabelDiv">
                        <label id="uploadingLabel">Uploading...</label>
                    </div>
                </div>
            </div>
        </div>
        <div id="uploadErrorReviewTitle" runat="server" class="container span10">
            <div id="uploadReviewHeaderContainer" class="pull-left">
                <h4 runat="server" id="uploadReviewHeader">Upload Error Review</h4>
            </div>
            <div class="pull-left">
                <a id="toggleViewErrorLinkButton" href="">
                    <label id="toggleViewErrorLabel" class="pull-left">Show Errors</label>
                    <img id="toggleViewErrorImage" class="pull-left" src="<%=ResolveClientUrl("~/img/vector-right-arrow-icons.png") %>" alt="show"/>                   
                </a>
            </div>
        </div>
        <div id="errorReportContainer" runat="server" class="container span10">
            <asp:HiddenField runat="server" ID="gridViewActionField"/>
            <div class="well">
                <asp:GridView ID="errorReportGridView" PagerStyle-CssClass="errorReportGridPagerTable"  PagerSettings-Position="TopAndBottom" PagerStyle-HorizontalAlign="Right"  PagerSettings-Mode="NumericFirstLast" OnPageIndexChanging="ErrorReportGridView_PageIndexChanging" GridLines="None" CssClass="table table-striped" OnRowDataBound="ErrorReportGridView_RowDataBound" runat="server" AllowPaging="true" PageSize="100" AutoGenerateColumns="false">
                    <HeaderStyle/>
                    <RowStyle/>
                    <Columns>
                        <asp:TemplateField HeaderText="Record">
                            <ItemTemplate>
                                 <span runat="server" id="recordSpan"></span>
                            </ItemTemplate>
                        </asp:TemplateField>    
                        <asp:TemplateField HeaderText="Loan No">
                            <ItemTemplate>
                                 <span runat="server" id="loanNoSpan"></span>
                            </ItemTemplate>
                        </asp:TemplateField>  
                        <asp:TemplateField HeaderText="Error Messaage">
                            <ItemTemplate>
                                 <span runat="server" id="errorMsgSpan"></span>
                            </ItemTemplate>
                        </asp:TemplateField>  
                    </Columns>
                    
                    <FooterStyle />
                </asp:GridView>
            </div>
            <%-- <table class="table table-striped"> --%>   

        </div>
    </div>
</asp:Content>

<asp:Content ContentPlaceHolderID="EndScriptsPlaceHolder" ID="EndScript" runat="server">
    <script type="text/javascript">
        $(document).ready(function () {
            if($.trim($("#<%=gridViewActionField.ClientID%>").val())=='paging') {
                $("#toggleViewErrorImage").attr("src", '<%=ResolveClientUrl("~/img/vector-down-arrow-icons.png")%>');
                $("#toggleViewErrorLabel").html("Hide Errors");               
            }
            $("#toggleViewErrorLinkButton").click(function (e) {
                e.preventDefault();
                if ($("#<%=errorReportContainer.ClientID%>").is(":visible")) {
                    $("#toggleViewErrorImage").attr("src", '<%=ResolveClientUrl("~/img/vector-right-arrow-icons.png")%>');
                    $("#toggleViewErrorLabel").html("Show Errors");
                    $("#<%=errorReportContainer.ClientID%>").hide('slow');
                }
                else {
                    $("#toggleViewErrorImage").attr("src", '<%=ResolveClientUrl("~/img/vector-down-arrow-icons.png")%>');
                    $("#toggleViewErrorLabel").html("Hide Errors");
                    $("#<%=errorReportContainer.ClientID%>").show('slow');
                }
            });
        });

        function btnUploadClicked() {
            $('#uploadLoadingModal').modal({
                backdrop: 'static',
                keyboard: false,
                show: false
            })

            $('#uploadLoadingModal').modal('show').css(
            {
                'margin-top': function () {
                    return window.pageYOffset-($(this).height() / 2 );
                }
            });
        }
    </script>
</asp:Content>